<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js摆一个小的v型</title>
    <style>
        body{
            margin: 0;
            padding: 0;
        }
        div{
            height: 50px;
            width: 50px;
            text-align: center;
            line-height: 50px;
            background-color: red;
            position: absolute;
            border:1px solid black;
        }
    </style>
</head>
<body></body>
<script>

    for(var i=0;i<11;i++){
        document.body.innerHTML+="<div>"+i+"</div>";
    }
    var divs = document.getElementsByTagName('div');
    for(var i=0;i<11;i++){
        divs[i].style.left=i*50+'px';
        if(Math.ceil(i/5)==1){
            divs[i].style.top=(i%5)*50+'px';
        }else if((Math.ceil(i/5)==2)&&(i%5!=0)){
            divs[i].style.top=(5-i%5)*50+'px';
        }

        if(i/5==1){
            divs[i].style.top=50*i+'px';
        }
    }

</script>
</html>

<!--目标：用11个div摆出一个v的造型-->
<!--推算过程：
    因为要摆成v的造型，所以0到10这是一个div的top值应该以此是：0*50、1*50、2*50、3*50、4*50、5*50、4*50、3*50、2*50、1*50、0*50
    所以我们要造出，0，1，2，3，4，5，4，3，2，1，0这几个数字
    仔细观察0到10这是一个数字发现：0-4这5个数字，除于5的余数就是0，1，2，3，4；6-10这5个数字，除于5的余数，再用5减一下得到的就是4，3，2，1，0
-->
